<!--
- Author:   .
- Date:    2017/7/17 0017.
- File:    step1.
-->
<template>
  <div class="p20 apply_box bg_fff">
    <p>换货原因 </p>
    <div class="apply_sel"><i class="iconfont icon-downdot2"></i><select v-model="reasonIdSelect">
      <option value="" selected>请选择换货原因</option>
      <option v-for="item in refundGoodsReasonList" v-bind:value="item.reason_id">{{item.reason_info}}</option>
    </select></div>
    <p>换货数量</p>
    <div class="apply_sel">
      <input type="tel" v-model="num" :placeholder="placeholder">
    </div>
    <div class="apply_txt">
      <p>本次换货金额为：<span class="cr_f60202">￥{{totalMoney}}</span></p>
      <div class="cr_41a536 pt10">换货成功后的金额将存入您的余额中，同时本次购买赠送的{{integration}}积分将被扣除。</div>

    </div>
    <p class="pt20">换货说明 </p>
    <div class="apply_sel"><textarea placeholder="最多200字" v-model="remark"></textarea></div>
    <div class="apply_sel2">
      <button @click="addRefund">提交申请</button>
    </div>
    <back-nav></back-nav>
  </div>
</template>

<script>
  import * as request from '../../../request'
  import {mapModules, mapRules} from 'vuet'

  export default{
    beforeRouteEnter (to, from, next) {
      request.getOrderInfo(to.params.orderId).then(data => {
        next(vm => {
          for (let i = 0; i < data.order_info.extend_order_goods.length; i++) {
            if (data.order_info.extend_order_goods[i].goods_id == to.params.goodsId) {
              vm.goodsInfo = data.order_info.extend_order_goods[i]
              break
            }
          }
        })
      }).catch(e => {
        next()
      })
    },
    mixins: [
      mapModules({refundGoodsReasonList: 'refundGoodsReasonList'}),
      mapRules({once: 'refundGoodsReasonList'})
    ],
    data() {
      return {
        goodsId: this.$route.params.goodsId,
        orderId: this.$route.params.orderId,
        reasonIdSelect: '',
        remark: '',
        num: '',
        goodsInfo: {},
        integration: 0, // 退货扣除的积分
        totalMoney: 0 // 退货总金额
      }
    },
    components: {},
    watch: {
      num: function (newValue) {
        if (newValue == '') {
          this.totalMoney = 0
          this.integration = 0
          return
        }
        var re = /^[1-9]+[0-9]*]*$/  // 判断字符串是否正整数
        if (!re.test(newValue)) {
          this.$toast('请输入正确数字')
          this.totalMoney = 0
          this.integration = 0
          return
        }
        let remainMax = parseInt(this.goodsInfo.goods_num - (this.goodsInfo.return_num || 0))
        if (parseInt(newValue) > remainMax) {
          this.$toast('换货数量超过订单商品的数量')
          this.num = remainMax
        } else {
          this.num = newValue
        }
        this.totalMoney = this.num * this.goodsInfo.goods_price
        this.integration = Math.floor(this.totalMoney * 0.05) // 积分是金额的5%
      }
    },
    computed: {
      placeholder: function () {
        if (this.goodsInfo.goods_num && this.goodsInfo.goods_num != '') {
          return '剩余换货数不能超过' + (this.goodsInfo.goods_num - (this.goodsInfo.return_num || 0))
        }
        return ''
      }
    },
    created() {
    },
    methods: {
      addRefund() {
        if (this.reasonIdSelect == '') {
          this.$toast('请选择原因')
          return
        }
        if (this.num == '') {
          this.$toast('请输入数量')
          return
        }
        let param = {
          buyer_message: this.remark,
          goods_id: this.goodsId,
          order_id: this.orderId,
          reason_info: this.reasonIdSelect,
          refund_type: this.$dictionary.refundType.goods,
          goods_num: this.num
        }
        this.$request.addRefund(param).then(data => {
          this.$toast('申请换货成功')
          this.$router.replace({name: 'refund-list', query: {type: this.$dictionary.refundType.goods}})
        }).catch(e => {
          this.$toast('申请换货失败：' + e.msg)
        })
      }
    }
  }
</script>

<style>

</style>